<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
        <meta name="format-detection" content="telephone=no" />
        <title>商家分类</title>
        <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
        <link rel="stylesheet" type="text/css" href="../../css/common.css" />
        <style>
            header .aui-title{
                font-size: 16px !important;
            }
            /*//头部*/
            .aui-bar{
                background: #fff;
            }
            .aui-tab-nav li.active {
                color: #327afa;
                border-bottom: 2px #327afa solid;
            }
            .iConent:before {
                content: "\e700" !important;
            }
            .aui-tab-nav li {
                font-size:15px;
                border-bottom:1px dotted #eee;
            }
            .aui-bar .search{
                height: 35px !important;
                margin:5px 0 !important;
                padding-left:35px;
                background: #f4f3f3;
                border:none;
                border-radius: 5px;
            }
            .divSeach{
                position: relative;
                width:70% !important;
                height: 45px;
                float: left;
                margin-left: 8px;
            }
            .aui-bar .aui-iconfont.aui-icon-search {
                position: absolute;
                left:0;
                color:#b0b0ae;
            }
            .aui-bar .aui-iconfont{
                color:#b0b0ae;
            }
            .headerRight{
                overflow:hidden;
            }
            .headerRight i:first-of-type{
                width:50%;
            }
        </style>
    </head>
    <body>
        <header class="aui-bar aui-bar-nav aui-border-b">
           <!--  <div class="aui-pull-left aui-iconfont aui-icon-close icon-left-coler" tapmode onclick="closeWin()"></div>
            <div class="aui-title">
                商家分类
            </div> -->
            <div>
                <div class="aui-pull-left aui-iconfont aui-icon-left icon-left-coler" tapmode onclick="closeWin()"></div>
                <!-- <div class="aui-title">
                    商家首页
                </div> -->
                <div class="divSeach">
                    <i class="aui-iconfont aui-icon-search aui-pull-left"></i>
                    <input type="search" class="search aui-pull-left" placeholder="请输入搜索内容" id="search-input">
                </div>
                <div class="headerRight">
                    <i class="aui-iconfont aui-icon-more  aui-pull-right" tapmode onclick="showPicker()"></i>
                </div>
            </div>
        </header>
    </body>
    <script type="text/javascript" src="../../script/api.js"></script>
    <script type="text/javascript" src="../../script/common.js"></script>
    <script type="text/javascript" src="../../script/jquery-1.11.3.js"></script>
    <script type="text/javascript" src="../../script/mui.js"></script>
    <script type="text/javascript">
        apiready = function() {
            api.parseTapmode();
            var mobile = api.pageParam.mobile;
            var header = $api.dom('header');
            //$api.fixStatusBar(header);
            api.setStatusBarStyle({
                  style : 'light'
            });
            var header_h = $api.offset(header).h;
            var body_h = $api.offset($api.dom('body')).h - header_h;
            api.openFrame({
                name : 'myType_frm',
                url : 'myType_frm.html',
                rect : {
                    x : 0,
                    y : header_h,
                    w : 'auto',
                    h : body_h
                },
                pageParam : {
                    mobile : mobile
                },
                bounces : false,
                vScrollBarEnabled : false,
                hScrollBarEnabled : false
            });
        }
        // mui遮罩
        var mask;
        // 显示遮罩
        function showPicker(){
            mask = mui.createMask(hidePicker);
            mask.show();
            //跨域执行子frame的显示mask
            api.execScript({
                frameName:"myType_frm",
                script:"showMask()"
            })
        }
        // 关闭遮罩
        function hidePicker(){
            //跨域执行子frame的关闭mask
            api.execScript({
                frameName:"myType_frm",
                script:"hideFrmMask()"
            })
        }
        //接收子frm执行的关闭遮罩
        function closeWinMask(){
            mask.myclose();
            //hidePicker();
        }
    </script>
</html>
